import Vue from 'vue'

Vue.directive('defaultSelect', {
  update(el, bindings) {
    const [defaultValues] = bindings.value // 获取设置的不可编辑默认值
    // 将默认值的close图标隐藏掉
    const dealStyle = (tags) => {
      // 循环将默认值数量的 close 图标隐藏
      tags.forEach((el, index) => {
        if (
          index <= defaultValues.length - 1 &&
            ![...el.classList].includes('select-tag-close-none')
        ) {
          el.style.display = 'none' // close 图标隐藏掉
        }
      })
    }
    // 隐藏 el-tag__close
    const tags = el.querySelectorAll('.el-tag__close')
    if (tags.length === 0) {
      setTimeout(() => {
        const tagTemp = el.querySelectorAll('.el-tag__close')
        dealStyle(tagTemp)
      })
    } else {
      dealStyle(tags)
    }
  }
})
